<template>
	<view>
		<z-paging :show-refresher-when-reload="false"  show-refresher-update-time  ref="paging" v-model="dataList" @query="queryList">
			<!-- z-paging默认铺满全屏，此时页面所有view都应放在z-paging标签内，否则会被盖住 -->
			<!-- 需要固定在页面顶部的view请通过slot="top"插入，包括自定义的导航栏 -->
			<view slot="top" class="">
				<view class="bar_css">
					<back title="足迹"></back>
					<view class="" style="height: 160rpx;">
						
					</view>
					<u-tabs  active-color="#333"  inactive-color="#000" bg-color="rgba(0,0,0,0)" :list="barList" font-size="28rpx" :is-scroll="true" :current="current" @change="barChange"></u-tabs>
				</view>
			</view>
			<view class="good_list">
				<view v-for="(item , index) in dataList" :key="index" class="good_list_item">
					<view class="good_list_item_time" >
						{{item.time}}
					</view>
					<view v-for="(ite , ind) in item.foot" :key="ind" class="good_list_item_good">
						<u-image @click="navTo(`/pages/shop_info/shop_info?id=${ite.gid}`)" :src="ite.goods_data.pic" width="194rpx" height="194rpx" border-radius="10" mode="aspectFit"></u-image>
						<view class="good_list_item_good_right">
							<view class="good_title uni-ellipsis-2">
								{{ite.goods_name}}
							</view>
							<view class="good_info_price">
								<view class="price" style="color: #333;">
									<view class="price_JPY">
										JPY
									</view>
									{{ite.goods_data.price}}
								</view>
							</view>
							<view class="del_box_btn">
								<view class="del_box">
									删除
								</view>
							</view>
							
						</view>
						
					</view>
				</view>
			</view>
		    
		</z-paging>
		
	</view>
</template>

<script>
	import back from '@/componts/back.vue';
	export default {
		components:{
			back
		},
		data() {
			return {
				style:null,
				choose_cid:null,
				
				item_style:{
					color:'#333',
					fontSize:'28rpx'
				},
				current:0,
				barList:[
					{name:'全部'},
				],
				dataList:[],
				cart_list:[]
			}
		},
		onShow() {
			this.getCountry()
			var style =  uni.getStorageSync('style')
			style = JSON.parse(style)
			this.style = style
		},
		methods: {
			// 删除足迹
			cate_list_del(id){
				var data = {
					id:id
				}
				uni.showModal({
					title: '提示',
					content: '是否确认删除该条数据?',
					cancelText: "取消", // 取消按钮的文字  
					confirmText: "确认", // 确认按钮的文字  
					showCancel: true, // 是否显示取消按钮，默认为 true
					success: (res) => {
					if(res.confirm) {  
						this.$wqzApi.UserCollection_foot_del(data).then(res=>{
							uni.showToast({
								title:'删除成功',
								icon:'none'
							})
							this.$refs.paging.reload()	
						})
					} else {  
						uni.showToast({
							title:'操作取消',
							icon:'none'
						})
						}  
					} 
				})
				// this.$wqzApi.UserCollection_foot_cate({}).then(res=>{
				// 	this.cart_list = res.data
				// 	this.barList.push(...res.data)
				// })
			},
			barChange(e){
					this.current = e
					this.choose_cid = this.barList[e].id
					this.$refs.paging.reload()	
					// // console.log(this.choose_cid)
			},
			// 获取分类足迹
			getCountry(){
					// ()
					this.barList=[ {name:'全部'}]
					this.$wqzApi.UserCollection_foot_cate({}).then(res=>{
						this.cart_list = res.data
						this.barList.push(...res.data)
					})
			},
			queryList(pageNo, pageSize) {
				var data = {
					page:pageNo,
					limit:pageSize,
					cid:this.choose_cid
				}
				this.$wqzApi.UserCollection_foot_list(data).then(res=>{
					
					this.$refs.paging.complete(res.data);
				}).catch(err=>{
					this.$refs.paging.complete(false);
				})
			},
			navTo(url){
				uni.navigateTo({
					url:url
				})
			}
		}
	}
</script>

<style lang="scss">
  @import url(./floot_list.css);
</style>
